<style lang="scss" scoped>
@import '../../styles/common/loading.less';
.container{
    border: none !important;
    margin-top: 4px;
}
.el-col-offset-1 {
    margin-left: 0%;
}
.button_a {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
}
.col_a {
    margin-left: 2%;
}
.el-card {
    height: 200px;
}

.el-button--primary {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
}
.input-textarea{
    height: 87px !important
}
</style>
<template>
    <!-- 调查任务处理详情页面 -->
    <div  class="common-background-color"
          v-loading="loading"
          element-loading-text="loading......"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.8)">
        <div style="width:98%;height:100%;margin: 6px 12px;">
            <el-collapse v-model="activeNames" >
                <el-collapse-item title="基本信息"  name="1">
                    <!-- 基本信息 -->
                    <el-form :rules="rules" ref="prpLSurvey" :model="prpLSurvey" class="info-submit-form">
                        <el-row type="flex">
                            <el-col :span="8">
                                <el-form-item label="大病赔案号">
                                    <el-input  v-model="prpLSurvey.caseNo" disabled></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="保单号">
                                    <el-input v-model="policyNo" disabled ></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="被保险人" >
                                    <el-input v-model="insuredName" disabled ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="8" >
                                <el-form-item label="社/医保号">
                                    <el-input v-model="socialSecurityNo" disabled ></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="证件类型">
                                    <el-input v-model="documentTypeName" disabled ></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="证件号">
                                    <el-input v-model="documentNo" disabled ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="8"  >
                                <el-form-item label="调查原因">
                                    <el-input v-model="prpLSurvey.surveyReasonName" disabled ></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="原因描述">
                                    <el-input v-model="prpLSurvey.surveyDescribe" disabled ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex" class="input-textarea">
                            <el-col :span="24">
                                <el-form-item label="地点描述" prop="addressDesc" :required="false">
                                    <el-input show-word-limit v-model="prpLSurvey.addressDesc" type="textarea" ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex" class="input-textarea">
                            <el-col :span="24">
                                <el-form-item label="经过" prop="surveyProcess" :required="false">
                                    <el-input show-word-limit  v-model="prpLSurvey.surveyProcess" type="textarea" ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex" class="input-textarea">
                            <el-col :span="24">
                                <el-form-item label="描述" prop="surveyRemark" :required="false">
                                    <el-input show-word-limit v-model="prpLSurvey.surveyRemark" type="textarea" ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex" class="input-textarea" :required="false">
                            <el-col :span="24">
                                <el-form-item label="结论" prop="surveyResult">
                                    <el-input show-word-limit  v-model="prpLSurvey.surveyResult" type="textarea" ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </el-collapse-item>
            </el-collapse>
            <el-collapse  v-model="activeNames" >
                <el-collapse-item title="调查历史轨迹信息"  name="2">
                  <!-- 调查轨迹信息 -->
                    <template>
                        <el-table
                            :data="researchHistory"
                            class="table"
                            ref="multipleTable"
                            header-cell-class-name="table-header"
                            style="margin: 5px 0;border: 1px solid #d6d9d8;"
                        >
                            <el-table-column type="index" label="序号" width="55" align="center"></el-table-column>
                            <el-table-column label="大病赔案号" align="center"  width="165">
                                <template slot-scope="scope" >
                                    <a @click="applicant(scope.row)" style="color: #1e99f9;cursor: pointer">{{ scope.row.caseNo }}</a>
                                </template>
                            </el-table-column>
                            <el-table-column prop="policyNo" label="保单号"  width="165" align="center"></el-table-column>
                            <el-table-column prop="handlerCode" label="调查员工号" align="center"></el-table-column>
                            <el-table-column prop="handlerName" label="调查员姓名" align="center"></el-table-column>
                            <el-table-column prop="surveyReason" label="调查原因" :formatter="formatSurveyReason" align="center"></el-table-column>
                            <el-table-column prop="surveyResult" label="调查结论" align="center"></el-table-column>
                            <el-table-column prop="auditTime" label="调查时间" align="center"></el-table-column>
                        </el-table>
                    </template>
                </el-collapse-item>
            </el-collapse>
        </div>
        <div style="margin-top: 25px;text-align: center;height: 70px">
            <el-button type="primary" size="medium" style="width: 9%" @click="documentUPload">单证上传</el-button>
            <el-button type="primary" size="medium" style="width: 9%" @click="documentQueryShow">查看单证</el-button>
            <el-button type="primary" size="medium" style="width: 9%" @click="onSubmit('prpLSurvey')">提交</el-button>
            <el-button type="primary" size="medium" style="width: 9%" @click="closePage">关闭</el-button>
        </div>
        <el-dialog
          :visible.sync="Successdialog"
          :show-close="false"
          :close-on-click-modal="true"
          :close-on-press-escape="false"
          width="20%"
          center>
          <div style="margin-top: -35px;">
            <div>| 调查审核提交</div>
            <hr style="width: 80%;margin-left: 1px">
          </div>
          <div v-if="this.item===0" style="text-align: center;margin-top: 20px">
            <img src="../../assets/images/pass.png" width="60">
            <div style="margin-top: 10px">提交成功</div>
            <div style="margin-top: 10px">大病赔案号：{{prpLSurvey.caseNo}}</div>
          </div>
          <div v-if="this.item===1" style="text-align: center;margin-top: 20px">
            <img src="../../assets/images/notPass.png" width="60">
            <div style="margin-top: 10px">提交失败</div>
            <div style="margin-top: 10px">大病赔案号：{{prpLSurvey.caseNo}}</div>
          </div>
          <div style="margin-top: 15px;text-align: center"><span style="font-size: x-large">{{time}}</span>秒后跳转到上一个页面</div>
          <div slot="footer" class="dialog-footer">
            <el-button @click="closePage" type="text">关闭</el-button>
          </div>
        </el-dialog>
    </div>
</template>

<script>
import {queryCaseSurveyDetail,querySurveyHistory,submitCaseSurvey,imgUPload,imgQueryShow} from '@/api/baseDate'
import Cookies from "js-cookie";
export default {
    name: 'surveyTaskListDetailCache',
    data() {
        return {
            loading: false,
            rules: {
                addressDesc: [{ required: true, message: '必填字段', trigger: 'blur' },],
                surveyProcess: [{ required: true, message: '必填字段', trigger: 'blur' }],
                surveyRemark: [{ required: true, message: '必填字段', trigger: 'blur' },],
                surveyResult: [{ required: true, message: '必填字段', trigger: 'blur' }],
            },
            //影像单证参数
            imgInfo: {
                policyNo: '',
                bussNo: '',
                comCode: '',
                userCode: ''
            },
            activeNames: ['1','2'],
            prpLSurvey: {
                caseNo:'',
            },
            policyNo:'', // 保单号
            insuredName:'', // 被保险人
            socialSecurityNo:'', // 社保号
            documentTypeName:'', // 证件类型
            documentNo:'', // 证件号
            comCode: '', // 归属机构
            id:'',
            researchHistory:[],
            Successdialog:false,
            time:0,
            item:0,
        };
    },
    activated(){
        if(this.$route.params.taskId!=undefined){
            this.queryCaseSurveyTaskDetail();
            this.getQuerySurveyHistory();
        }
    },
    created() {
        this.queryCaseSurveyTaskDetail();
        this.getQuerySurveyHistory();
    },
    methods: {
        //单证上传方法
        documentUPload() {
            this.imgInfo.userCode=  Cookies.get("userCode");
            this.imgInfo.policyNo=this.policyNo;
            this.imgInfo.comCode=this.comCode;
            this.imgInfo.bussNo=this.prpLSurvey.caseNo;

            if(this.imgInfo.policyNo != null  && this.imgInfo.bussNo != null && this.imgInfo.comCode != null && this.imgInfo.userCode != null){
              imgUPload(this.imgInfo).then(res => {
                  window.open(res.data.url)
              })
            } else {
              this.$message.error(`请您先暂存后，再上传影像资料！`);
            }
        },
        //查看单证方法
        documentQueryShow(){
          this.imgInfo.bussNo= this.prpLSurvey.caseNo;
          console.log(this.imgInfo.bussNo)
          if(this.imgInfo.bussNo !== null){
            imgQueryShow(this.imgInfo.bussNo).then(res => {
                window.open(res.data.url)
            })
          }else{
              this.$message.error(`请您先暂存后，再上传影像资料！`);
          }
        },
        // 调查任务详情
        queryCaseSurveyTaskDetail(){
            let taskId  = this.$route.params.taskId;
            this.id = taskId;
            this.taskState = this.$route.params.taskState;
            const param = {
                id: this.id,
            }
            this.policyNo = this.$route.params.policyNo;
            this.insuredName = this.$route.params.insuredName;
            this.socialSecurityNo = this.$route.params.socialSecurityNo;
            this.documentTypeName = this.$route.params.documentTypeName;
            this.documentNo = this.$route.params.documentNo;
            this.comCode = this.$route.params.comCode;
            queryCaseSurveyDetail(param) .then((res)=> {
                if(res){
                    if(res.data.resultCode){
                        if(res.data.resultCode != '0000'){ 
                          // 返回失败
                          this.$message.error(res.data.resultMsg);
                        }else{
                            this.prpLSurvey = res.data;
                            if (this.prpLSurvey.surveyReason ==='1' ) {
                                this.prpLSurvey.surveyReasonName = '频繁报销'
                            } else if (this.prpLSurvey.surveyReason === '2') {
                                this.prpLSurvey.surveyReasonName = '异地就医'
                            } else if (this.prpLSurvey.surveyReason === '9') {
                                this.prpLSurvey.surveyReasonName = '其它'
                            }
                        }
                    }else{
                        this.$message.error('系统异常'); 
                    }
                }else{
                  this.$message.error('系统异常'); 
                }
            })

        },
        getQuerySurveyHistory(){
            var data={
               documentNo: this.documentNo,
            }
            querySurveyHistory(data)
                .then(res => {
                    this.researchHistory=res.data;
                })
        },
        onSubmit(formName){
          this.$refs[formName].validate((valid) => {
            if (valid) {
                var data={
                    ...this.prpLSurvey,
                    handleComrCode: Cookies.get("makeCom"),
                    handleComrName: Cookies.get("cMakeCom"),
                    handlerName: Cookies.get("userName"),
                    handlerCode: Cookies.get("userCode"),
                }
                // 禁止重复点击
                if(this.loading){
                    return;
                }
                this.loading = true;
                submitCaseSurvey(data)
                    .then(res => {
                        this.loading = false;
                        if(res.data.resultCode != '0000'){ 
                            // 返回失败
                            // this.$message.error(res.data.resultMsg);
                            this.$alert(res.data.resultMsg,'提示', {
                                confirmButtonText: '确定'
                            });
                            return;
                        }
                        this.item=0,
                        this.Successdialog=true
                        // 把time改为5
                        this.time = 5;
                        // 设定一个定时器，每一秒调用一次coundDown方法，time-1
                        setInterval(this.countDown, 1000);
                    }).catch((function () {
                        // let THIS = this;
                        this.item=1,
                            this.Successdialog=true
                        // 把time改为5
                        this.time = 5;
                        // 设定一个定时器，每一秒调用一次coundDown方法，time-1
                        setInterval(this.countDown, 1000);
                    }))
            } else {
              return false;
            }
          });

        },
        applicant(row){
          this.form=row,
          this.$router.push({
              name: 'surveyTaskHistoryDetail',
              query: {
                form: JSON.stringify(this.form),
                prpLSurvey: JSON.stringify(this.prpLSurvey),
                item: JSON.stringify(this.item),
                its: JSON.stringify(0)
              }
          })
        },
        // 关闭当前页
        closePage(){
            this.Successdialog=false
            this.closePageTo(this.$store,this.$route,this.$router,'surveyTaskList'); 
        },
        // 封装一个方法
        countDown() {
            let THIS = this;
            THIS.time--;
        }
    },
    watch: {
        // 监听time的值
        time: function (newVal) {
            if (newVal == 0) {
                this.Successdialog=false
                this.closePageTo(this.$store,this.$route,this.$router,'surveyTaskList');
            }
        }
    }
}
</script>